OAuth Single Sign-On (SSO) For Shopify Using WordPress as an Identity Provider

Overview

Shopify integration with WordPress (OAuth) allow your customers to login to the store using WordPress as an identity provider (OAuth). Here the WordPress works as an OAuth provider for Shopify SSO application using miniOrange as an Identity Broker. In this guide we will see how to implement WordPress Single Sign-On (SSO) solution on your Shopify store in the easiest way.

Our solution also supports advanced features such as user profile attribute mapping and role mapping, making it a breeze to manage user access. In this guide, we’ll walk you through how to configure WordPress (OAuth) SSO for user authentication in Shopify. By the end, your users will be able to log in securely and access your Shopify store with their WordPress credentials....read more

Want to explore more features of the Shopify Single Sign-On app? Click here to learn more.

Add Application Pricing Plans

Note: If you want to configure SSO into Shopify Store using WordPress as SAML IDP, then follow the guide provided here.

Pre-requisite: Shopify Single Sign-On - SSO Application

WordPress OAuth Identity Provider (IDP)

• Log into your WordPress instance as an admin.
• Go to the WordPress Dashboard -> Plugins and click on Add New.
• Search for WordPress OAuth IdP plugin and click on Install Now.
• Once installed click on Activate.

Shopify Single Sign-On (SSO)

• Visit Shopify app store.
• Search for miniOrange SSO.
• Add Shopify Single Sign-On (SSO) application on your Store.

Configuration Steps

Setup guide for Configuring WordPress as an identity provider (OAuth) for SSO into Shopify

Step 1: Get the Callback URL from the Shopify SSO App

• Go to your Shopify store and navigate to the App section and click on Single Sign On - SSO login application.

• Click on the Add Identity Provider button to add your IDP.

• Select OAuth 2.0 protocol.

• Now choose WordPress from the list of identity providers (IDPs).

• Copy the OAuth Callback URL and keep it handy as it will be used in further steps.

Step 2: Configuring Shopify as a Service Provider (SP) in WordPress

• Log into your WordPress instance as an admin
• Go to the WordPress Dashboard -> Plugins and click on Add New.
• Download the WordPress OAuth Server Single Sign-On (SSO) plugin and click on Install Now.
• Once installed, click on Activate.
• Now, go to the miniOrange OAuth Server plugin on the left side menu and search your OAuth client from the list, Here Shopify.

• Enter the Client Name as per your choice. Enter Redirect URI/ OAuth Callback URI which is copied from the Shopify store and click on the Save Client button.

• After saving the client in the WordPress OAuth Server Plugin, you will get the Client ID & Client Secret. Keep these values handy as you will need them later.

• Also, please note the endpoints such as Authorization, Token, User Info endpoints which you can configure in your client application.

Step 3: Configure WordPress as Identity Provider (IDP) in Shopify

• Navigate back to the miniOrange Single Sign On-SSO application.

• Click on the Add Identity Provider button to add your IDP.

• Select OAuth 2.0 protocol.

• Now choose WordPress from the list of identity providers (IDPs).

• Now, fill in the required details like IDP Name, Endpoints, Client ID, Client Secret, and Scope.

• Click on Save.

Step 4: Test Connections

• After saving the identity provider (IDP) configuration, you will be redirected to the Test Connection step.
  Please perform Test Connection before mapping or fetching attributes, test connection ensures that your identity provider configuration is correct.
• Click on the Test Connection button.

• On entering valid WordPress credentials you will see a pop-up window which is shown in the below screen.

• Click on the Fetch Attributes button to fetch the identity provider attribute.

Step 5: Attribute Mapping

• Click on the + Attribute Mapping button to map attributes between Shopify and WordPress.

• Map the attributes by referring to the table below:

• Click on Next.

Step 6: Enable SSO Login Button (In case of Shopify legacy accounts only)

Note: This step applies only to Shopify legacy accounts and not Shopify customer accounts.

• Navigate to the Enable SSO Button section.
• The following button attributes can be customized: button text, text below SSO button, background color, text color, width, and height.

• By default, the “Enable SSO Button” option is in enabled state.
• If it is not, enable it first, then click the Enable Extension button, as shown in the image below.

• Enable the SSO Login Widget IDP extension.
• You will see the Login with miniOrange button added to your Shopify store.
• Click on Save

Step 7: Enable & Test SSO Configurations

Select Shopify Store Type:

• Non-Plus Store
• Plus Store

SSO Configuration in Non-Plus Shopify Stores

Choose the type of account you have enabled on your Shopify Store:

• Customer Accounts
• Legacy Customer Accounts

• Go to the application dashboard, enable the customer accounts extension as shown in the below image.

• Enable the New Customer Accounts extension and click on Save.

• Navigate to the application home page and enable the IDP Login toggle option against the IDP you have configured.

Testing Single Sign-On (SSO) for your Shopify store

• Go to your Shopify Store.(https://<your-shopify-storedomain>)
• Click on the User login icon.

• You’ll be redirected to the login page of the identity provider (IDP) you configured in the previous step. Log in with your IDP account credentials.
• Next, enter the six-digit OTP that will be sent to your registered email address. (This is a one-time process)

• You’ll be successfully logged in to your Shopify store.

• Go to the application dashboard, you will see a warning box to add the login button extension on the Account page, click on the login widget extension link as shown in the below image to enable it.

• Navigate to the application home page and enable the IDP Login toggle option against the IDP you have configured.

• If you want to configure SSO into Shopify using multiple IDPs, then select your IDP from the list provided here, and setup SSO using that IDP.
• Enable the IDP login toggle option for enabling SSO into Shopify using multiple IDPs.

Testing Single Sign-On (SSO) for your Shopify store

• Go to your Shopify Store login page.(https://<your-shopify-storedomain>/account/login)
• Click on the login button you customized earlier.

• You'll be redirected to the identity provider (IDP) login page. Now log in with your existing account credentials.

• After login, if you encounter an "invalid or missing reCAPTCHA token" error, accompanied by a "Something went wrong" message, refer to this FAQ to resolve the error.

SSO Configuration in Plus Shopify Stores

Choose the type of account you have enabled on your Shopify Store:

• Customer Accounts
• Legacy Customer Accounts

• Go back to the SSO application, and navigate to Connect Store tab. Copy the Client ID, Client Secret, Post-Logout Redirect URL and Discovery Endpoint URL and keep them handy.

• Click on the Customer Accounts link as shown in the below image.

• Select the Customer accounts option recommended by Shopify & look for the Identity Provider option, if not present please reach out to shopifysupport@xecurify.com.

• If the identity provider is present, click on Manage.

• Click on Connect to Provider button.

• Add the Identity Provider name and fill in the details such as Discovery endpoint URL, Client ID, Client secret, Additional Scopes, Post-logout redirect URI parameter that you copied from above step. Click on Save.

• Once the Identity Provider has been added, do the Test Connection.

• After verifying the flow make the identity provider as Active.

• Navigate to the application home page and enable the IDP Login toggle option against the IDP you have configured.

Testing Single Sign-On (SSO) for your Shopify store

• Go to your Shopify Store.(https://<your-shopify-storedomain>)
• Click on the User login icon.

• You’ll be redirected to the login page of the identity provider (IDP) you configured in the previous step. Log in with your IDP account credentials.

• You’ll be successfully logged in to your Shopify store.

• Now, click on the Setup Guide button and follow the steps mentioned to get multipass token.

• Enable the Multipass Token option. Refer to this Faq to get the Multipass token value and paste it in the below field.

• Click on Save.

• Go to the application dashboard, you will see a warning box to add the login button extension on the Account page, click on the login widget extension link as shown in the below image to enable it.

• Navigate to the application home page and enable the IDP Login toggle option against the IDP you have configured.

• If you want to configure SSO into Shopify using multiple IDPs, then select your IDP from the list provided here, and setup SSO using that IDP.
• Enable the IDP login toggle option for enabling SSO into Shopify using multiple IDPs.

Testing Single Sign-On (SSO) for your Shopify store

• Go to your Shopify Store login page.(https://<your-shopify-storedomain>/account/login)
• Click on the login button you customized earlier.

• You'll be redirected to the identity provider (IDP) login page. Now log in with your existing account credentials.

• If you encounter an "invalid or missing reCAPTCHA token" error, accompanied by a "Something went wrong" message, refer to this FAQ to resolve the error.

• You’ll be successfully logged in to your Shopify store.

Hence you have successfully configured Shopify Single Sign-On (SSO) using WordPress as an identity provider (IDP) and Shopify as a service provider (SP). using miniOrange Single Sign-On (SSO) login application. This solution ensures that you are ready to roll out secure access to your Shopify store using WordPress login credentials within minutes.

Additional Resources

• Shopify Security Solutions
• Shopify Single Sign-On (SSO)
• Shopify Content restriction
• Shopify Subscription

Get in Touch

Please reach out to us at shopifysupport@xecurify.com, and our team will assist you with setting up the Shopify SSO application. Our team will help you to select the best suitable solution/plan as per your requirement.